<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        function f(x) {
            var zs = x.id - x.value.length;
            if (zs<0){
                zs=0;
                x.value=x.value.substring(0,x.id);
            }
            document.getElementById("xz").innerHTML = "还能输入" + zs + "个字符";
        }
    </script>
</head>
<body>
用户名:
<br/>
<input  id="8" type="text" onkeyup="f(this)"/>
用户名最多8个字符
<br/>
<span id="xz">还能输入:8个字符</span>
</body>
</html>